@import url("//unpkg.com/element-ui@2.15.10/lib/theme-chalk/index.css");

*{
   margin: 0;
   padding: 0;
}

a{
   text-decoration: none;
   color: #404040;
}

ul{
   list-style: none;
}

body{
   background-color: #f8f8f8!important;   
   font-size: 12px;
   line-height: 1.5;
   font-family: 微软雅黑 !important;
   color: #404040;
   text-align: left;
}

/* 整体容器 */
.container{
   width: 1440px;
   height: 960px;
   margin-top: 20px;
   /* background-color: aqua; */
}



/* 右边容器 */
.right-container{
   width: 990px;
   height: 800px;
   /* background-color: lightblue; */
   float: left;
   margin-left: 20px;
}

.right-container .main-head{
   width: 100%;
   height: 178px;
   background-image: url("../img/head-bg.png");
   background-repeat: no-repeat;
   background-position: 0 8px;
   position: relative;
   background-color: #fff;
   /* background-color: lightcoral; */
}
.main-head #bell{
   position: absolute;
   right: 10px;
}

/* 头部左侧 */
.main-head .head-left{
   width: 625px;
   height: 140px;
   /* background-color: lightblue; */
   float: left;
   margin-top: 19px;
   border-right: 1px dotted #dddddd;
}

.head-left>a{
   position: relative;
   width: 115px;
   height: 115px;
   display: block;
   float: left;
   text-decoration: none;
   margin:12.5px;
}

.head-left .touxiang{
   width: 115px;
   height: 115px;
}

.head-left .user-msg{
   width: 112px;
   height: 76px;
   /* background-color: lightcyan; */
   float: left;
   margin-top: 32px;
}

.head-left .user-msg p a{
   font-size: 18px;
   color: #333333;
   font-weight: bolder;
   text-decoration: none;
}

.head-left .vip{
   float: left;
   margin-left: 180px;
   margin-top: 25px;
}
.vip p{
   display: block;
   margin-left: 5px;
}

/* 头部右侧 优惠券 */
.head-right{
   width: 360px;
   height: 100px;
   /* background-color: lightcoral; */
   float: left;
   margin-top: 40px;
   font-size: 16px;
}

.head-right a{
   display: block;
   margin-left: 30px;
   text-decoration: none;
   color: #333333;
   width: 130px;
   height: 26px;
   float: left;
}

.head-right b{
   color: #ff8700;
   /* width: 60px; */
   /* text-align: right; */
   margin-left: 30px;
}

.head-right .youhuiquan{
   margin-top: 35px;
}
.head-right .diyongquan{
   margin-top: 35px;
}

.main-body{
   width: 100%;
   height: 100%;
}


/* 订单 */
.my-order{
   width: 72%;
   min-height: 360px;
   margin-top: 10px;
   background-color: #fff;
   float: left;
   /* background-color: #ff8700; */
}

.order-head{
   width: 100%;
   height: 62px;
   border-bottom: 1px solid #e9e9e9;
   line-height: 62px;
   color: #333333;

   /* background-color: lightcoral; */
}
.order-head span{
   display: block;
   width: 100px;
   height: 59px;
   float: left;
   font-size: 16px;
   border-right: 1px solid #e9e9e9;
   cursor: pointer;
   border-top: 3px solid #4c5a65;
   color: #333333;
   font-weight: 500;
   border-bottom-color: #fff;
   text-align: center;
   line-height: 62px;
}

.order-head a{
   font-size: 14px;
   float: right;
   text-decoration: none;
   color: #333333;
   margin-right: 20px;
}
.order-head a:hover{
   color: #1db44e;
}

/* 酒店信息 */
.my-order .order-list ul{
   list-style: none;
}

.list-content > li > div{
   display: inline-block;
}

.my-order .order-list ul li{
   height: 74px;
   border-bottom: 1px solid #e9e9e9;
}


.my-order .order-list .item-desc{
   width: 43.4%;
   margin-left: 40px;
}

.item-desc img{
   width: 10%;
   float: left;
   margin-top: 24px;
}

.item-desc>div{
   display: inline-block;
   width: 83%;
   margin-left: 10px;
   /* float: left; */
   margin-top: 16px;
}

.item-desc .main-title{
   font-size: 14px;
   color: #333;
}

.item-desc .sub-title{
   font-size: 12px;
   color: #999;
   margin-top: 8px;
}

.item-price, .item-statue{
   width: 18%;
   text-align: center;
   vertical-align: middle;
}

.item-price{
   color: #f60;
   font-size: 14px;
   margin-top: -30px;
}

.item-statue{
   font-size: 14px;
   color: #333;
   margin-top: -30px;
   margin-left: 60px;
}

.item-statue .statue-link{
   color: #22c233;
   text-decoration: none;
}

/* 如果没有订单 显示的图 */
.my-order .no-order{
   color: #bababa;
   font-size: 14px;
   text-align: center;
   margin-top: 60px;
   min-height: 240px;
   /* background-color: #1db44e; */
}

.no-order a{
   color: #666666!important;
}



/* 隔断条 */
.gap{
   width: 100%;
   height: 20px;
   background-color: #f8f8f8;
}

/* 猜你喜欢 */
/* .guess{
   width: 72%;
   height: 500px;
   background-color: lightcoral;
} */
.guess{
   width: 100%;
   height: 300px;
   /* background-color: lightcoral; */
   /* margin-top: 20px; */
} 

.guess>span{
   padding: 0 20px;
   border-left: 5px solid #4c5a65;
   color: #333333;
   font-size: 16px;
   font-weight: 500;
}

.recommend-list{
   list-style: none;
   margin-top: 10px;
}

.recommend-list>li{
   width: 330px;
   padding-left: 20px;
   display: inline-block;
   padding-bottom: 20px;
}

.recommend-hotel{
   width: 100%;
   background-color: #f6f6f6;
   padding-top: 5px;
   /* text-align: center; */

}

.recommend-hotel:hover{
   cursor: pointer;
}

.recommend-hotel img{
   width: 160px;
   height: 100px;
}

.recommend-hotel .recommend-name{
   width: 160px;
   position: absolute;
   margin-left: 170px;
   margin-top: -90px;
   color: #333333;
   font-size: 16px;
   font-weight: 600;
   overflow: hidden;
}
.recommend-name:hover{
   color: lightgray;
}
.recommend-hotel .recommend-price{
   position: absolute;
   margin-left: 170px;
   margin-top: -40px;
   font-size: 14px;
}
.recommend-price>span{
   color: #f60;
}

/* 收藏 */
.my-collection{
   position: relative;
   float: right;
   width: 26%;
   background-color: #fff;
   margin-top: 10px;
   min-height: 180px;
}


.my-collection>span{
   padding: 0 20px;
   border-left: 5px solid #4c5a65;
   color: #333333;
   font-size: 16px;
   font-weight: 500;
   /* position: relative; */
   cursor: pointer;
}

.my-collection>span:hover{
   
   border-left: 5px solid #1db44e;
   color: #1db44e;
   
}

.collection-list{
   width: 100%;
   padding-left: 10px;
}

.collection-list .list-content .item-desc{
   width: 100%;
}

.collection-list .list-content .item-desc .main-title{
   overflow: hidden;
}



/* 没收藏 */
.my-collection .no-col{
   font-size: 12px;
   text-align: center;
   margin-top: 20px;
}

/* 会员 */
.vip-head{
   width: 100%;
   height: 360px;
   background-color: #fff;
   padding-left: 20px;
}

.vip-head>span{
   display: inline-block;
   margin-top: 20px;
   height: 18px;
   padding-left: 15px;
   border-left: 4px solid #59b713;
   line-height: 18px;
   color: #59b713;
   font-size: 18px;
}

/* 会员信息 */
.vip-msg{
   margin-top: 15px;
}
.mc_bi {
   float: left;
   width: 199px;
}

.mc_bi_up {
   padding-top: 15px;
   background-color: #4e4e4e;
   background: url("../img/spirit.png") 0 bottom no-repeat;
   text-align: center;
   padding-bottom: 8px;
}

.mc_bi_avatar {
   position: relative;
   height: 111px;
}

.mc_bi_avatar_mask {
   position: absolute;
   z-index: 2;
   left: 54px;
   top: -1px;
   width: 115px;
   height: 126px;
   background-position: 0 0;
}

.mc_bi_name{
   display: block;
   font-size:18px;
   color:#fff;
   margin-top: 10px;
}

.mc_bi_down{
   padding:10px 15px 16px;
   background:#3c3838;
   line-height:20px;
   font-size:12px;
   color:#999
}

.mc_bi_down .mc_green{
   color: #1db44e;
}

.mc_bi_down .mc_white{
   color: white;
}

.mc_bi_down .mc_yellow{
   color: #f8b04b;;
}

.mc_bi_down_desc{
   color:#ddd
}

/* 等级框 */
.vip-msg .level{
   float: left;
   /* background-color: #1db44e; */
}

.level span{
   display: block;
   color: #666;
   font-size: 14px;
}

.level .level_process{
   height: 52px;
   background-position: -2px -79px;
   background: url("../img/level.png") 0 0 no-repeat;
}

/* 会员特权 */
.vip-desc{
   background-color: #fff;
}

.vip-desc h2{
   width: 100%;
   height: 50px;
   border-bottom: 1px solid #e9e9e9;
   line-height: 50px;
}

.dengjiquanyi{
   padding: 0 20px 20px 20px;
}

.typespan{
   display: block;
   height: 20px;
   border-left: 4px solid #59b713;
   line-height: 20px;
   color: #59b713;
   font-size: 18px;
   padding-left: 10px;
   margin-top: 20px;
}

.biaoge1, .biaoge2{
   padding-top: 20px;
}

.dengjiquanyi table{
   border-color: grey;
   border-collapse: collapse;
   border-spacing: 0;
}

.biaoge1 th{
   background: #f5f5f5;
}

.biaoge1 th, .biaoge1 td{
   height: 38px;
   border: 1px solid #e8e8e8;
   text-align: center;
   color: #666;
   width: 100px;
}

.biaoge1 .modu_level_yes{
   background-position: center -90px;
   background-image: url("../img/member-spirit.png");
   background-repeat: no-repeat;
}

.biaoge2 th, .biaoge2 td{
   text-align: center;
   color: #666;
   width: 300px;
   height: auto;
   border: 1px solid #e8e8e8;

}

.biaoge2 table{
   border: 1px solid #e8e8e8;
}


/* =========我的收藏======== */
.shoucang .detail-title{
   padding: 8px 20px 8px 0px;
   height: 30px;
   padding-left: 20px;
   color: #333;
   font: 600 16px/30px"Microsoft Yahei";
}

.shoucang .detail-title span{
   border-left: 5px solid #37c249;
   padding-left: 20px;
}

.shoucang .focus-list{
   margin: 10px 19px;
   width: 99%;
}

.focus-list .title{
   width: 100%;
}

.focus-list .title_1{
   width: 10%;
}

.focus-list .title>div {
   padding: 10px 0;
   float: left;
   color: #7A7A7A;
   background: #F6F6F6;
   text-align: center;
}

.focus-list .title .del-batch-btn {
   font-weight: 600;
   color: #000;
   cursor: pointer;
}

.title .del-batch-btn:hover{
   color: #37c249;
}

.focus-list .title_2{
   border-bottom: 1px solid #F6F6F6;
   width: 60%;
}

.focus-list .title_3{
   border-bottom: 1px solid #F6F6F6;
   width: 10%;
}

.focus-list .title_4{
   border-bottom: 1px solid #F6F6F6;
   width: 20%;
}

.focus-list .detail>div {
   padding: 10px 0;
   float: left;
   height: 125px;
   border-bottom: 1px dashed #ddd;
   position: relative;
}

.focus-list .detail {
   border-bottom: 1px solid #F2F2F2;
}

.focus-list .detail .title_1>input {
   margin: 60px 25px;
}

.focus-list .detail .title_2>a {
   width: 190px;
   height: 115px;
   display: inline-block;
   padding: 10px;
   text-decoration: none;
}

.focus-list .detail .title_2 > a img {
   width: 100%;
   height: 100%;
}

.focus-list .detail .title_2>.focus-name {
   padding: 15px 25px;
   width: 62%;
   height: 40px;
   position: relative;
   top: -134px;
   left: 202px;
   font-size: 14px;
}

.focus-list .detail .title_2 > .tour-type,.focus-list .detail .title_2 > .comment-info{
   padding: 5px;
   width: 250px;
   position: relative;
   left: 215px;
   font-size: 12px;
}
.focus-list .detail .title_2 > .tour-type{
   top: -120px;
}

.focus-list .detail .title_2>.tour-type>span {
   color: #22C233;
}

.focus-list .detail .title_2 > .tour-type img {
   width: 20px;
   margin-left: 5px;
   position: relative;
   top: 5px;
   cursor: pointer;
}

.focus-list .detail .title_2>.comment-info {
   color: #999;
   width: 450px!important;
   top: -120px;
}

.focus-list .detail .title_3 {
   color: #F60;
   font-weight: 600;
   font-size: 20px;
}

.focus-list .detail .title_3 p {
   margin: 50px 10px;
   line-height: 15px;
}
.focus-list .detail .title_3 p>span {
   font-size: 14px !important;
}

.focus-list .detail .title_4 .order-btn {
   position: relative;
   top: 30px;
   left: 50px;
   padding: 11px 37px;
   background: #FF8700;
   color: #fff;
   font-weight: 600;
   font-size: 14px;
   font-family: "宋体" !important;
   border-radius: 3px;
}

.focus-list .detail .title_4 .del-btn {
   margin: 50px 50px;
   padding: 6px 35px;
   width: 30px;
   background: #fff;
   border: 1px solid #DDD;
   color: #989898;
   font-weight: 600;
   font-size: 14px;
   font-family: "宋体" !important;
   border-radius: 3px;
   cursor: pointer;
}


/* ====我的优惠券==== */
.coupon_header {
   background: #ffffff;
   width: 990px;
   height: 100px;
   margin-bottom: 20px;
   background-image: url("../img/head_bgm.png");
   background-size: 100%;
   position: relative;
}

.coupon_header .bell{
   position: absolute;
   right: 10px;
}

.coupon_header .coupon_info {
   padding: 40px 0 0 30px;
   font-family: MicrosoftYaHei-Bold;
   font-size: 20px;
   color: #333333;
   line-height: 20px;
   text-align: left;
   font-weight: bold;
}

.coupon_info .coupon_num {
   color: #f60;
   padding: 0 5px;
}

.coupon_floor {
   width: 989px;
   background-color: #fff;
}

.coupon_floor .coupon_ul_div {
   border-bottom: 1px solid #e9e9e9;
   height: 49px;
}
.coupon_li {
   float: left;
   cursor: pointer;
}

.li_active .coupon_span {
   border-top: 3px solid #4c5a65;
   border-bottom: none;
   border-right: 1px solid #e9e9e9;
   color: #333;
   height: 30px;
}

.coupon_span {
   background: #ffffff;
   width: 150px;
   height: 32px;
   padding-top: 17px;
   display: block;
   font-family: MicrosoftYaHei-Bold;
   font-size: 16px;
   color: #666;
   font-weight: bold;
   letter-spacing: 0px;
   line-height: 16px;
   text-align: center;
   border-right: 1px solid #e9e9e9;
}

.coupon_content {
   overflow: hidden;
   zoom: 1;
   min-height: 358px;
   
}

.not_used,.guoqi_have_used{
   float: left;
   padding: 10px 0 10px 0;
   width: 100%;
   
}

#coupon_list{
   /* display: flex; */
   list-style: none;
}

#coupon_list>li{
   width: 220px;
   padding-left: 20px;
   display:inline-block;
   padding-bottom:20px;
}

#coupon_list .coupon_detail{
   width:100%;
   height:100px;
   /* background:lightblue; */
   border-radius:10px;
   color: white;
}

.coupon_detail .coupon_type{
   width: 35%;
   height: 100%;
   float: left;
   background-color: #45da74;
   border-top-left-radius: 10px;
   border-bottom-left-radius: 10px;
   font-size: 16px;
   font-weight: 800;
   line-height: 90px;
   text-align: center;
}

.coupon_detail .coupon_price_time{
   width: 64%;
   height: 100%;
   float: left;
   background-color: lightblue;
   border-top-right-radius: 10px;
   border-bottom-right-radius: 10px;
   /* text-align: center; */
}

.coupon_price_time .price_and_discount{
   display: block;
   /* padding: 20px 0px 10px 20px; */
   margin-top: 16px;
   font-size: 16px;
   font-weight: 800;
   padding-left: 4px;
}

.coupon_price_time .time_begin{
   margin-top: 10px;
}

.coupon_price_time .time_begin,.time_end{
   display: inline-block;
   padding-left: 4px;
}

#coupon_type{
   background-color: lightgray;
   border-right: solid 1px rgb(110, 107, 107);
}

#coupon_price_time{
   background-color: lightgray;
}

/* ========订单========= */
.right-container .top{
   height: 55px;
   text-align: center;
}
.right-container #order-tab{
   height: 100%;
   font-size: 16px;
   font-weight: bold;
   color: #333;
   background-color: #fff;
   border: 1px solid #e9e9e9;
   list-style: none;
   width: 625px;
}

#order-tab .focus{
   border-bottom-color:#22c233;
   color: #22c233;
}

#order-tab li{
   color: #333;
   float: left;
   border-bottom: 3px solid transparent;
   cursor: pointer;
   width: 125px;
   text-align: center;
   height: 53px;
}

#order-tab li i{
   font-style: normal;
   line-height: 54px;
   border-right: 1px solid #ddd;
   display: block;
   cursor: pointer;
   text-align: center;
   width: 100%;
   height: 100%;
}

#order-choose{
   line-height: 30px;
   background-color: #eee;
   color: #666;
   font-size: 14px;
   padding: 10px 20px;
   text-align: center;
   border-bottom: 1px solid #e9e9e9;
   height: 30px;
}

#order-choose >span{
   display: inline-block;
}

#order-choose .order-info{
   width: 31%;
   text-align: left;
   float: left;
}

#order-choose .order-list{
   width: 11%;
   float: left;
}
.order-list select{
   width: 100%;
   height: 100%;
   margin-top: -2px;
   padding: 4px;
   border-color: (rgb(118, 118, 118), rgb(133, 133, 133));
}

#order-choose .li1{
   width: 10%;
}

#order-choose .order-price{
   margin-left: 40px;
}

#order-choose .order-statue, #order-choose .order-operate{
   margin-left: 70px;
}
/* 订单 */
.order-item-list{
   background-color: #fff;
}

.order-item{
   padding: 10px 20px;
}

.order-item .item-header{
   padding: 10px 0;
   font-size: 14px;
   color: #666;
}

.item-header .order-id{
   margin-left: 40px;
}

.order-item .item-detail{
   padding: 10px 0 23px 0;
   font-size: 14px;
   border-bottom: 1px solid #ddd;
   color: #333333;
   height: 60px;
}

.order-item > .item-detail > div{
   float: left;
}

.item-detail .item-desc{
   width: 31%;
}

.item-desc .item-icon{
   display: block;
   width: 9%;
   margin-right: 19px;
   margin-top: 10px;
   float: left;
}

.item-desc p{
   display: inline-block;
   width: 75%;
}

.item-desc .subtitle{
   display: block;
   font-size: 14px;
   color: #666;
   margin-top: 8px;
}

.item-detail .item-kind{
   width: 11%;
   text-align: center;
   margin-top: 10px;
}

.item-detail .item-mount{
   text-align: center;
   width: 10%;
   margin-top: 10px;
   margin-left: 30px;
}

.item-detail .item-time{
   width: 13%;
   text-align: center;
   margin-top: 10px;
}

.item-detail .item-price{
   width: 10%;
   text-align: center;
   color: #ff6600;
   margin-top: 10px;
}

.item-detail .item-statue{
   width: 13%;
   text-align: center;
   margin-top: -10px;
   margin-left: 10px;
}

.item-detail .item-statue p img{
   width: 14%;
}

.item-detail .item-statue p a{
   color: #22c233;
   text-decoration: none;
}

.item-detail .item-operate{
   /* width: 9%; */
   text-align: center;
}

.item-detail .item-operate .btn{
   text-decoration: none;
   display: block;
   width: 68px;
   text-align: center;
   padding: 3px 0;
   color: #ff8800;
   border: 1px solid #ff8800;
   font-size: 12px;
   margin: 10px auto;
}

.item-detail .item-operate .commentBtn,.payBtn{
   text-decoration: none;
   display: block;
   position: relative;
   width: 68px;
   text-align: center;
   padding: 3px 0;
   color: #ff8800;
   border: 1px solid #ff8800;
   font-size: 12px;
   margin-top: -70px;
}